<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
    
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>${_title}</title>

    <!-- Bootstrap core CSS -->

    <link href="${_css}/bootstrap.min.css" rel="stylesheet">

    <link href="${_font}/css/font-awesome.min.css" rel="stylesheet">
    <link href="${_css}/animate.min.css" rel="stylesheet">

    <!-- Custom styling plus plugins -->
    <link href="${_css}/custom.css" rel="stylesheet">
    <link href="${_css}/icheck/flat/green.css" rel="stylesheet">


	<link type="text/css" href="${_js}/ueditor/themes/default/css/ueditor.css" rel="stylesheet"/>

    <script src="${_js}/jquery.min.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->

</head>


<body style="background: #F7F7F7;">
<div class="">
    <div class="row">
        <div class="col-md-12 col-sm-12 col-xs-12">
            <div class="x_panel">
                <div class="x_title">
                    <h2>发布新闻</h2>
                    <div class="clearfix"></div>
                </div>
                <div class="x_content">

                    <form class="form-horizontal form-label-left" novalidate>
                        <div class="item form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12" for="title">新闻标题 <span class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
                            	<input type="hidden" id="articleId" value="<#if item?exists>${item.id}</#if>"></hidden>
                                	<input id="title" class="form-control col-md-7 col-xs-12" value="<#if item?exists & item.title?exists>${item.title}</#if>"
                                	name="title" placeholder="输入新闻标题" required="required" type="text">
                            </div>
                        </div>
                        <div class="item form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">类目<span class="required">*</span>
                                </label>
                                <div class="col-md-3 col-sm-3 col-xs-6">
									<select class="form-control" id="articleType">
									<#if item?exists>
										<#if (articleTypes?exists & articleTypes?size>0)>
											<#list articleTypes as articleType>
												<option value="${articleType.id}" <#if item.typeId==articleType.id> selected="selected"</#if>>${articleType.name}</option>
											</#list>
										</#if>
									<#else>
										<option value="-1">--请选择--</option>
										<#if (articleTypes?exists & articleTypes?size>0)>
											<#list articleTypes as articleType>
												<option value="${articleType.id}">${articleType.name}</option>
											</#list>
										</#if>
									</#if>
									</select>
                                </div>
                            </div>    
                        <div class="item form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12" for="author">作者<span class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
                            	<input id="author" class="form-control col-md-7 col-xs-12" value="<#if item?exists & item.author?exists>${item.author}</#if>"
	                                name="author" placeholder="输入作者" required="required" type="text">
                            </div>
                        </div>
                        <div class="item form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12" for="tags">标签<span class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
	                            <input id="tags" class="form-control col-md-7 col-xs-12" value="<#if item?exists & item.tags?exists>${item.tags}</#if>"
	                                name="tags" placeholder="输入标签" required="required" type="text">
                            </div>
                        </div>
                        <div class="item form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12" for="order">排序号 <span class="required">*</span>
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
                            	<input id="order" class="form-control col-md-7 col-xs-12" value="<#if item?exists & item.articleOrder?exists>${item.articleOrder}</#if>"
	                                name="order" placeholder="输入排序号" required="required" type="text"
	                                onkeyup="value=value.replace(/[^\d]/g,'')" >
                            </div>
                        </div>
                        <div class="item form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12" for="desc">描述
                            </label>
                            <div class="col-md-6 col-sm-6 col-xs-12">
								<textarea id="desc" required="required" name="desc" 
								class="form-control col-md-7 col-xs-12"><#if item?exists & item.desc?exists>${item.desc}</#if></textarea>
                            </div>
                        </div>
                                               
						</div>                        
                    </form>
                </div>
            </div>
        </div>
    </div>
	</div>

    <div class="row">
		<div class="col-md-12 col-sm-12 col-xs-12">
			<div class="x_panel">
				<div class="x_title">
		            <h2>新闻封面图片</h2>
		                
		            <div class="clearfix"></div>
		        </div>
		        <div class="x_content">
		            <form action="/file/upload" id="uploadForm" class="dropzone" style="border: 1px solid #e5e5e5; height: 300px;">
		            	<input type="hidden" id="resources" value="<#if item?exists & item.resourceId?exists>${item.resourceId}</#if>">
		            </form>
		        </div>
		    </div>
		</div>
	 </div>
    <div class="row">
		<div class="col-md-12 col-sm-12 col-xs-12">
			<div class="x_panel">
				<div class="x_title">
		            <h2>新闻内容</h2>
		            <div class="clearfix"></div>
		        </div>
		        <div style="width: 1884px; max-height: 500px; z-index: 999; overflow: scroll;">
					<script id="editor" type="text/plain" style="height:500px;"></script>
				</div>
		    </div>
		</div>
	 </div>
	 						 	
    <div class="row">
		<div class="col-md-12 col-sm-12 col-xs-12">
		    <div class="ln_solid"></div>
		    <div class="form-group">
		        <div class="col-md-12 col-md-offset-5">
		            <button type="button" onclick="javascript:history.go(-1)" class="btn btn-primary">返回前一页</button>
		            <#if item?exists>
			            <button id="send" type="button" class="btn btn-success">确认发布</button>
			        <#else>
			            <button id="send" type="button" class="btn btn-success">保存</button>
		            </#if>
		        </div>
		    </div>			
		</div>
	</div> 

</div>

    <script src="${_js}/bootstrap.min.js"></script>
    <!-- bootstrap progress js -->
	<script src="${_js}/progressbar/bootstrap-progressbar.min.js" type="text/javascript"></script>
	<script src="${_js}/nicescroll/jquery.nicescroll.min.js" type="text/javascript"></script>
    <!-- icheck -->
    <script src="${_js}/icheck/icheck.min.js"></script>
    
	<script src="${_js}/custom.js" type="text/javascript"></script>
	<!-- dropzone -->
    <script src="${_js}/dropzone/dropzone.js" type="text/javascript" ></script>

    <script type="text/javascript" charset="utf-8" src="${_js}/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="${_js}/ueditor/ueditor.all.js"> </script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="${_js}/ueditor/lang/zh-cn/zh-cn.js"></script>
            
    <script type="text/javascript">
    	var ueditor = UE.getEditor('editor');
    	$(document).ready(function () {
           		var text = '<#if (item?exists) && (item.content?exists)>${item.content}</#if>';
        		ueditor.addListener( 'ready', function() {
			    ueditor.setContent(text);
           });
        });
        
		$.ajaxSetup({
			headers: {'Content-Type': 'application/json;charset=UTF-8'}
		});     
		   
		
		   
        var uploadFiles = [];
		$("#picture-select").change(function () {
			$.each(this.files, function (index, fileObj) {
				uploadFiles.push(fileObj);
				for (var i = 0; i < uploadFiles.length; i++) {
				    var fileObj = uploadFiles[i];
				    readFileIntoDataUrl(fileObj).done(function (dataUrl) {
				        var imgTag = $("#editor").find("img[src='" + dataUrl + "']");
				        console.log(imgTag);
				        $("#uploadForm").attr("method","post");
				        $("#uploadForm").attr("enctype","multipart/form-data");
				            $("#uploadForm").submit();<!-- controller获取的文件为空？-->
				    });
				}	
			});
		});
		 
		var readFileIntoDataUrl = function (fileInfo) {
			var loader = $.Deferred(),
				fReader = new FileReader();
			fReader.onload = function (e) {
				loader.resolve(e.target.result);
			};
			fReader.onerror = loader.reject;
			fReader.onprogress = loader.notify;
			fReader.readAsDataURL(fileInfo);
			return loader.promise();
		};
        
		$(".btn-success").click(function(){
			$('#descr').val($('#editor').html())
			var content = ueditor.getContent();
			var type = $("#articleType").find("option:selected").val();
			var resourceId = $("#resources").val();
			var title = $.trim($("#title").val());
			var author = $.trim($("#author").val());
			var desc = $.trim($("#desc").val());
			var order = $.trim($("#order").val());
			var tags = $.trim($("#tags").val());
			var articleId = $("#articleId").val();
			if(type == "-1"){
				alert("请选择文章类目");
			    return;
			}
			var info=JSON.stringify({
				id:articleId,
				typeId:type,
				resourceId:resourceId,
				title:title,
				author:author,
				desc:desc,
				articleOrder:order,
				tags:tags,
				content:content
			});
			$.ajax({
	            type: 'POST',
	            dataType: 'JSON',
	            async:'false',
	            headers: {'Content-type': 'application/json;charset=UTF-8'},
	            url: '/admin/article/saveArticle',
	            data:info,
	            success: function(result){
	       		  if(result.code==-1){
	            		alert("操作成功");
			        	window.location.href="/admin/article/list";
	       		  }else{
	            		alert(result.msg);      		  	
	       		  }
	            }
		    })	
			
		});
		$(".dropzone").dropzone({
			acceptedFiles:'.jpg',
		    init: function() {
		        this.on("complete", function(file) {
		        	window.result=file;
		        	if(file!=null){
			        	var result = JSON.parse(file.xhr.response);
			        	if(result.code == 0){
			        		alert("请先登录！");
							top.location.href = "/admin/login";	        		
			        	}
			        	$("#resources").attr("value",result.entity);
		        	}
		        });
		    }
		});
    </script>
</body>

</html>